<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Vuex的核心概念</title>
</head>

<body>
  <div>
    <p>1.state是管理的全局状态,把状态绑定到组件(视图),渲染到界面展示给用户</p>
    <p>2.用户可以通过比如按钮等进行交互，通过dispatch分发到Actions</p>
    <p>3.不直接提交Mutations是因为Actions可以进行异步操作</p>
    <p>4.异步操作完成后通过commit提交到Mutations进行更改</p>
    <p>5.Mutations是同步的,所有状态的修改是通过Mutations</p>
    <p>6.通过Mutations的目的是可以追踪状态的所有变化</p>
  </div>
  <div>
    <h1>Store</h1>
    <p>Store是一个容器,包含着应用中的大部分状态,我们不能直接改变Store中的状态,
      需要提交Mutations中进行改变</p>

    <h1>State</h1>
    <p>State是一个状态保存在Store中</p>

    <h1>Getter</h1>
    <p>Getter就像是vue中的计算属性,内部可以对计算的结果进行缓存,只有当依赖的状态发生
      改变的时候才会重新去计算
    </p>

    <h1>Mutation</h1>
    <p>Mutation状态的变化必须提交Mutations来完成</p>

    <h1>Action</h1>
    <p>Action和Mutation类似,不同的是Action可以进行异步的操作,内部改变状态的时候
      都需要提交Mutation
    </p>

    <h1>Module</h1>
    <p>Module模块,可以将Store分割为模块,每个模块拥有自己的Store,State，Getter,Mutation，
      Action
    </p>
  </div>
  <script>
  </script>
</body>

</html>